<template>
  <div>
    <basic-container>
      <div class="app-container">
        <el-form :model="queryParams" :rules="rules" ref="queryForm" size="small" :inline="true">
          <div>
            <div class="nameTitle" style="margin-top: 10px;">YB08泵盖码更新</div>
            <el-form-item label="壳体码">
              <el-input v-model="queryParams.code" placeholder="请输入壳体码" style="width: 200px;"></el-input>
            </el-form-item>
            <el-form-item label="泵盖码">
              <el-input v-model="queryParams.supplies" placeholder="请输入泵盖码" style="width: 200px;"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-check" size="mini"
                :disabled="!queryParams.code || !queryParams.supplies" @click="DefiniteMdification">确定</el-button>
            </el-form-item>
          </div>


          <div>
            <div class="nameTitle">YB08总成打码纠正客户端</div>
            <el-form-item label="壳体码">
              <el-input v-model="queryClient.sequence" placeholder="请输入壳体码" style="width: 200px;" clearable></el-input>
            </el-form-item>
            <el-form-item label="总成码">
              <el-input v-model="queryClient.code" placeholder="请输入总成码" style="width: 200px;" clearable></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-check" size="mini" :disabled="DisabledTwo"
                @click="SubmitQuery">提交</el-button>

              <el-button type="primary" icon="el-icon-delete" size="mini" :disabled="DisabledTwo"
                @click="delqrcode">删除总码</el-button>
            </el-form-item>
          </div>

          <div>
            <div class="nameTitle">YB08工站记录日志客户端</div>
            <el-form-item label="设备号">
              <!-- <el-input v-model="queryLog.facility_id" placeholder="请输入泵盖码" style="width: 200px;" clearable></el-input> -->
              <el-select v-model="queryLog.facility_id" placeholder="请选择">
                <el-option v-for="item in options" :key="item.facility_id" :label="item.name" :value="item.facility_id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="壳体码">
              <el-input v-model="queryLog.sequence" placeholder="请输入壳体码" style="width: 200px;" clearable></el-input>
            </el-form-item>
            <el-form-item label="操作日志">
              <el-input v-model="queryLog.note" placeholder="请输入泵盖码" style="width: 200px;" clearable></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-check" size="mini" :disabled="Disabledther" @click="thereSumint">提交</el-button>

            </el-form-item>
          </div>
        </el-form>
      </div>
    </basic-container>
  </div>
</template>

<script>
import { bindview, bindcontrols, dlecontrols, facilitId,bindLog } from "@/api/view2";

export default {
  data() {
    return {
      options: [],
      loading: false,
      titleLab: '',
      titleLabtwo: '',
      titleLabwhere: '',
      minNub: '',

      maxNub: '',
      maxTwo: '',
      maxthere: '',
      eidMaxnum: '',
      eidMinnum: '',
      title: "壳体总码绑定",
      queryParams: {
        code: '',
        supplies: ''
      },
      queryClient: {
        sequence: '',
        code: ''
      },
      queryLog: {
        sequence: '',
        note: '',
        facility_id: null
      },
      menuMessTwo: '',
      rules: {
        sn: [{ required: true, message: "壳体码不能为空", trigger: "blur" }],
        code: [{ required: true, message: "总码不能为空", trigger: "blur" }],
        grade: [{ required: true, message: "等级不能为空", trigger: "blur" }]
      }
    };
  },
  created() {
    this.gitfacilitName()
  },
  computed: {
    isDisabled() {
      return !this.queryParams.sn.trim() || !this.queryParams.code.trim() || !this.queryParams.grade.trim();
    },
    DisabledTwo() {
      return !(this.queryClient.sequence || this.queryClient.code);
    },
    Disabledther() {
      return !(this.queryLog.sequence && this.queryLog.facility_id && this.queryLog.note);
    },
    menudis() {
      return !this.menuMessTwo.trim();
    },

  },
  methods: {
    DefiniteMdification() {
      bindview(this.queryParams).then(res => {
        console.log(res);
        this.$message({
          message: "更新泵盖码成功",
          type: "success"
        });
        this.queryParams.code = '';
        this.queryParams.supplies = '';
      });
    },
    SubmitQuery() {
      if (!this.queryClient.code || !this.queryClient.sequence) {
        this.$message({
          message: "请输入完整码",
          type: "error"
        });
        return
      }

      bindcontrols(this.queryClient).then(res => {
        console.log(res);
        this.$message({
          message: "成功",
          type: "success"
        });
        this.queryClient.code = '';
        this.queryClient.sequence = '';
      });
    },
    delqrcode() {
      if (!this.queryClient.sequence) {
        this.$message({
          message: "请输入壳体码",
          type: "error"
        });
        return
      }
      let data = {
        sequence: this.queryClient.sequence
      }
      dlecontrols(data).then(res => {
        console.log(res);
        this.$message({
          message: "删除成功",
          type: "success"
        });
      })
    },
    gitfacilitName() {
      facilitId().then(res => {
        console.log(res);
        this.options = res.data.data
      })
    },
    thereSumint(){
      this.queryLog.facility_id = Number(this.queryLog.facility_id);
      bindLog(this.queryLog).then(res=>{
        console.log(res);
        this.$message({
          message: "成功",
          type: "success"
        });
      })
    }

  }
};
</script>

<style>
.nameTitle {
  margin-top: 60px;
  font-weight: 600;
  padding: 20px 50px;

}

/* 添加你的样式 */
</style>